<template>
  <div class="f-box">
    <div class="header">
      <label>博文编辑</label>
    </div>
    <div class="form">
      <el-form ref="form" label-width="100px" label-position="left">
        <el-form-item label="文章标题">
          <el-input v-model="title"></el-input>
        </el-form-item>
        <el-form-item label="关键字">
          <el-input v-model="keyword"></el-input>
        </el-form-item>
        <el-form-item label="内容">
          <el-input v-model="content"></el-input>
        </el-form-item>
        <!-- <el-form-item label="最后修改时间">
          <el-input v-model="lastTime" disabled></el-input>
        </el-form-item>
        <el-form-item label="新增时间">
          <el-input v-model="addTime" disabled></el-input>
        </el-form-item> -->
        <el-form-item>
          <el-button type="primary" @click="onSubmit">提交</el-button>
          <el-button @click="back">返回</el-button>
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>
<script>
// import vueUeditor from 'vue-ueditor'
import request from "@/utils/request";
import { setDiscussId, getDiscussId } from "@/utils/auth";
export default {
  name: "articleUpdate",
  components: {},
  data() {
    return {
      title: "",
      keyword: "",
      ue: "",
      content: "",
      lastTime: "",
      addTime: "",
      articleId: "",
      dataObject: ""
    };
  },
  mounted() {
    console.log(this.$route.params);
    if (this.$route.params.discuss_id) {
      setDiscussId(this.$route.params.discuss_id);
      this.articleId = this.$route.params.discuss_id;
    } else {
      this.articleId = getDiscussId();
    }

    this.init();
  },
  methods: {
    onSubmit() {
      const params = {
        title: this.title,
        keyword: this.keyword,
        content: this.content,
        id: this.articleId
      };
      request({
        url: "/api/article/updateArticle",
        method: "post",
        data: params
      }).then(res => {
        console.log(res);
        if (res.msg === "修改成功") {
          this.$message({
            message: "修改成功！",
            type: "success"
          });
          this.$router.push("/article-manager");
        }
      });
    },
    back() {
      this.$router.push("/article-manager");
    },
    init() {
      // console.log(this.articleId);
      // 根据传过来的id 查询文章详情
      request({
        url: "/api/article/getInfoById",
        method: "post",
        data: {id: this.articleId}
      }).then(res => {
        console.log(res);
        if (res.msg === "查询成功") {
          this.dataObject = res.data[0];
          this.title = this.dataObject.title;
          this.content = this.dataObject.content;
          this.keyword = this.dataObject.keyword;
          this.lastTime = '-';
          this.addTime = '-';
        }
      });
    }
  }
};
</script>
<style lang="scss" scoped>
.f-box {
  width: 100%;
  height: 700px;
  //   border: 1px solid #fff;
  margin: auto;
  .header {
    width: 50%;
    margin: auto;
    height: 50px;
    background: rgb(68, 114, 196);
    line-height: 50px;
    color: #fff;
    text-align: center;
    label {
      font-size: 16px;
    }
  }
  .form {
    width: 50%;

    margin: auto;
    margin-top: 20px;
  }
}
</style>
